<template>
  <div class="goods-add-container">
    <div class="type-container">
      <div style="margin-bottom:100px">
        <entity  :goods="goods" :isAdd="isAdd" v-if="type === 1"/>
        <virtual :goods="goods" :isAdd="isAdd" v-else/>
      </div>      
    </div>
  </div>
</template>

<script>
import Entity from './components/Entity'
import Virtual from './components/Virtual'
import { goods } from './components/goodsData'
import { getGoods } from '@/api/score'

export default {
  name: 'add',
  components: {
    Entity,
    Virtual
  },
  data() {
    return {
      goods: { key: this.$store.state.app.activeApp.saa_key, ...goods },
      isEntity: true,
      type: 1,
      id: this.$route.query.id,
      isAdd: true
    }
  },
  watch: {
    type(newValue) {
      this.goods.type = newValue;
    }
  },
  mounted() {
    if(this.id) {
      this.getGoods();
      this.isAdd = false;
    }
  },
  methods: {
    switchType(type) {
      this.type = type;
    },
    /**
     * 获取商品
     */
    getGoods() {
      const params = { key: this.$store.state.app.activeApp.saa_key, id: this.id };
      getGoods(params).then(res => {
        if(res.status === 200) {
          this.goods = res.data;
        }else if(res.status === 204) {
          this.$message.warning('未查询到该商品数据');
        }else{
          this.$message.error(res.message);
        }
      })
    }
  }
}
</script>

<style lang="css" scoped>
.goods-add-container{
  margin: 25px;
  background-color: #fff;
  padding:25px;
  box-shadow: 0px 0px 4px 0px rgba(115, 115, 115, 0.2);
}
.goods-title{
  height: 47px;
  width: 100%;
  line-height: 47px;
  font-size: 16px; 
  font-weight: 600;
  letter-spacing: 2px;
  color: #8f8f8f;
  padding: 0 10px;
  background-color: #F4F8FB;
}
.type-container{

}
.content-container{
  padding: 25px 60px;
  width: 100%;
  display: flex;
  /* background-color: #ccc; */
}
.content-container>div{
  flex: 1;
}
.content-container-text{
  font-size: 14px;
  color: #c0c4cc;
  padding: 20px 0;
}
</style>